let canvas = document.getElementById('inner');
// 获取执行上下文和绘画功能

if(canvas.getContext){
  // 支持canvas
  let ctx = canvas.getContext('2d');
  ctx.font = "14px serif";
  ctx.fillStyle = 'rgba(255,255,255,0.1)';
  ctx.fillText("水印设置",10, 20);

  let out = document.getElementById('tutorial');
  const outCtx = out.getContext('2d');

  // 水印铺满整个页面
  // 获取浏览器可视页面的宽高
  let clientHeight = 0;
  let clientWidth = 0;
  if(document.body.clientHeight && document.documentElement.clientHeight){
    clientHeight = Math.min(document.body.clientHeight,document.documentElement.clientHeight)
  }else{
    clientHeight = Math.max(document.body.clientHeight,document.documentElement.clientHeight)
  }
  if(document.body.clientWidth && document.documentElement.clientWidth){
    clientWidth = Math.min(document.body.clientWidth,document.documentElement.clientWidth)
  }else{
    clientWidth = Math.max(document.body.clientWidth,document.documentElement.clientWidth)
  }

  out.width = clientWidth;
  out.height = clientHeight;
  const n = Math.floor(clientHeight/30)
  const m = Math.floor(clientWidth/80)

  console.log('浏览器可视区域',clientHeight,clientWidth)

  for(let i=0;i<m;i++){
    for(let j=0;j<n;j++){
      outCtx.drawImage(canvas,i*80,j*30)
    }
  }
  

}else{
  console.log('不支持canvas')
}

